import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { Card } from 'antd';
import moment from 'moment';
import StandardTable from '@/components/StandardTable';

@connect(({ integratedqueryns, loading }) => ({
  loading: loading.models.integratedqueryns,
  oncePayListData: integratedqueryns.oncePayListData, // 一次性收费列表数据
}))
@Form.create()
class EmpInfor extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      statusMap: ['', 'default', 'processing', 'warning', 'success'],
    };
  }

  componentDidMount() {}

  jumpRouting = (targetRouter, baseInfoId) => {
    const { jumpRouting } = this.props;
    jumpRouting(targetRouter, baseInfoId);
  };

  render() {
    const { oncePayListData, loading } = this.props;
    // eslint-disable-next-line no-unused-vars
    const { statusMap } = this.state;
    const columns = [
      {
        title: '客户名称',
        dataIndex: 'custName',
        onHeaderCell: () => ({
          style: {
            fontWeight: 'bold',
            textAlign: 'left',
          },
        }),
        onCell: () => ({ style: { textAlign: 'left' } }),
      },
      {
        title: '产品名称',
        dataIndex: 'pdName',
        onHeaderCell: () => ({
          style: {
            fontWeight: 'bold',
            textAlign: 'left',
          },
        }),
        onCell: () => ({ style: { textAlign: 'left' } }),
      },
      {
        title: '业务年月',
        dataIndex: 'busiYm',
        onCell: () => ({ style: { textAlign: 'left' } }),
        onHeaderCell: () => ({ style: { textAlign: 'left', fontWeight: 'bold' } }),
        render: text => text && moment(text).format('YYYY-MM'),
        // render: val => `${`${val}`.substring(0, 4)}-${`${val}`.substring(4)}`,
      },
      {
        title: '收费总金额',
        dataIndex: 'feeAmo',
        onCell: () => ({ style: { textAlign: 'left' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'left' } }),
        render: text => text && text.toFixed(2),
      },
      {
        title: '收费方式',
        dataIndex: 'feeWayName',
        onCell: () => ({ style: { textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
      },
      {
        title: '状态',
        dataIndex: 'feeStaName',
        onCell: () => ({ style: { textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        // render: (val, record) => (
        //   <Badge status={val === 7 ? statusMap[4] : statusMap[val]} text={record.billStateName} />
        // ),
      },
      {
        title: '接单发送人',
        dataIndex: 'feeSta',
        onCell: () => ({ style: { textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
      },
      {
        title: '创建时间',
        dataIndex: 'creTime',
        onCell: () => ({ style: { textAlign: 'left' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'left' } }),
        render: val => moment(val).format('YYYY-MM-DD HH:mm') || '无',
      },
      {
        title: '操作',
        dataIndex: 'operName',
        onCell: () => ({ style: { textAlign: 'center' } }),
        onHeaderCell: () => ({ style: { fontWeight: 'bold', textAlign: 'center' } }),
        render: (text, record) => (
          <span
            style={{ color: '#1890FF', cursor: 'pointer' }}
            onClick={() => this.jumpRouting('onceFeePayId', record.onceFeePayId)}
          >
            查看
          </span>
        ),
      },
    ];

    return (
      <div>
        <Card
          style={{ marginBottom: 12 }}
          title={<span style={{ fontWeight: 'bolder' }}>一次性付费</span>}
          bordered={false}
          extra={<a onClick={() => this.jumpRouting('onceFeePayId')}>更多&gt;&gt;</a>}
          id="oncepay"
        >
          <StandardTable
            selectedRows={[]}
            selectedRowKeys={[]}
            rowSelection={null}
            loading={loading}
            data={oncePayListData}
            columns={columns}
            rowKey="onceFeePayId"
            pagination={false}
          />
        </Card>
      </div>
    );
  }
}
export default EmpInfor;
